﻿var mn_nav = {
    Init: function () {
        this.Create();
    },
    Create: function () {
        $('#sdt_menu > li').bind('mouseenter', function () {
            var $elem = $(this);
            $elem.find('img')
						 .stop(true)
						 .animate({
						     'width': '180px',
						     'height': '70px',
						     'left': '0px'
						 }, 200, 'easeOutBack')
						 .andSelf()
						 .find('.sdt_wrap')
					     .stop(true)
						 .animate({ 'top': '100px' }, 10, 'easeOutBack')
						 .andSelf()
						 .find('.sdt_active')
					     .stop(true)
						 .animate({ 'height': '180px' }, 10, function () {
						     var $sub_menu = $elem.find('.sdt_box');
						     if ($sub_menu.length) {
						         var left = '180px';
						         if ($elem.parent().children().length == $elem.index() + 1)
						             left = '-180px';
						         $sub_menu.show().animate({ 'left': left }, 10);
						     }
						 });
        }).bind('mouseleave', function () {
            var $elem = $(this);
            var $sub_menu = $elem.find('.sdt_box');
            if ($sub_menu.length)
                $sub_menu.hide().css('left', '0px');

            $elem.find('.sdt_active')
						 .stop(true)
						 .animate({ 'height': '0px' }, 100)
						 .andSelf().find('img')
						 .stop(true)
						 .animate({
						     'width': '0px',
						     'height': '0px',
						     'left': '85px'
						 }, 200)
						 .andSelf()
						 .find('.sdt_wrap')
						 .stop(true)
						 .animate({ 'top': '10px' }, 200);
        });
    }

}